$(function () {
  initLabList();
  function initLabList() {
    var query = {
      pagenum: 1,
      pagesize: 5000,
      lab_class_name: "",
      lab_class_person: "",
      lab_status: "",
    };
    $.ajax({
      method: "GET",
      url: "/my/labManage/labElectricList/",
      data: query,
      success: function (res) {
        var dormNames = res.data.map(
          (item) => item.lab_address + " " + item.lab_class_name
        );
        var electricData = res.data.map((item) => item.electric);
        renderChart(dormNames, electricData);
      },
      Error: function (err) {
        console.error("请求失败", err);
      },
    });
  }

  function renderChart(dormNames, electricData) {
    var oColumn = this.echarts.init(document.getElementById("curve_show"));
    var oColumnopt = {
      title: {
        text: "宿舍电量统计",
      },
      tooltip: {},
      legend: {
        data: ["电量"],
      },
      xAxis: {
        type: "category",
        data: dormNames,
      },
      yAxis: {
        type: "value",
      },
      series: [
        {
          name: "电量",
          type: "bar",
          data: electricData,
          showBackground: true,
          itemStyle: {
            color: "rgba(173, 216, 230, 0.2)",
          },
        },
      ],
    };
    oColumn.setOption(oColumnopt);

    // --------------------圆圈
    var oPie = echarts.init(document.getElementById("pie_show"));
    var oPieopt = {
      title: {
        top: 10,
        text: "宿舍报修分析",
        x: "center",
      },
      tooltip: {
        trigger: "item",
        formatter: "{a} <br/>{b} : {c} ({d}%)",
      },
      color: [
        "#5885e8",
        "#13cfd5",
        "#00ce68",
        "#ff9565",
        "#00BFFF",
        "#DAA520",
        "#BEBEBE",
      ],
      legend: {
        x: "center",
        top: 65,
        data: [
          "水电类",
          "五金类",
          "墙面和地面",
          "卫生设施",
          "电器类",
          "网络类",
          "其他",
        ],
      },
      toolbox: {
        show: true,
        x: "center",
        top: 35,
        feature: {
          mark: {
            show: true,
          },
          dataView: {
            show: true,
            readOnly: false,
          },
          magicType: {
            show: true,
            type: ["pie", "funnel"],
            option: {
              funnel: {
                x: "25%",
                width: "50%",
                funnelAlign: "left",
                max: 1548,
              },
            },
          },
          restore: {
            show: true,
          },
          saveAsImage: {
            show: true,
          },
        },
      },
      calculable: true,
      series: [
        {
          name: "访问来源",
          type: "pie",
          radius: ["45%", "60%"],
          center: ["50%", "65%"],
          data: [
            {
              value: 300,
              name: "水电类",
            },
            {
              value: 100,
              name: "五金类",
            },
            {
              value: 260,
              name: "墙面和地面",
            },
            {
              value: 180,
              name: "卫生设施",
            },
            {
              value: 180,
              name: "电器类",
            },
            {
              value: 180,
              name: "网络类",
            },
            {
              value: 180,
              name: "其他",
            },
          ],
        },
      ],
    };
    oPie.setOption(oPieopt);
  }
});
